﻿@*
    For more information on enabling MVC for empty projects, visit https://go.microsoft.com/fwlink/?LinkID=397860
*@
@{
    Layout = null;
}
<link href="~/scripts/layui-v2.5.6/layui/css/layui.css" rel="stylesheet" />
<style>
    .form-container {
        padding: 20px;
        background: #fff;
        margin: 20px;
        border-radius: 5px;
        box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    }

    .form-title {
        font-size: 18px;
        font-weight: bold;
        margin-bottom: 20px;
        color: #333;
        border-bottom: 2px solid #1E9FFF;
        padding-bottom: 10px;
    }

    .layui-form-item {
        margin-bottom: 15px;
        display: flex;
        align-items: flex-start;
    }

    .layui-form-label {
        width: 120px;
        text-align: right;
        padding-right: 10px;
        margin-top: 8px;
        flex-shrink: 0;
    }

    .layui-input-block {
        margin-left: 0;
        flex: 1;
    }

    .layui-form-text .layui-form-label {
        margin-top: 8px;
        align-self: flex-start;
    }

    .button-group {
        text-align: center;
        margin-top: 30px;
        padding-top: 20px;
        border-top: 1px solid #e6e6e6;
    }

    .auto-generate-btn {
        margin-left: 10px;
    }

    .required {
        color: red;
    }

    .flex-input-container {
        display: flex;
        align-items: center;
        width: 100%;
    }

        .flex-input-container input {
            flex: 1;
        }

    .layui-form-item .layui-input,
    .layui-form-item .layui-textarea {
        width: 100%;
    }

    .layui-form-item input[type="radio"] {
        margin-right: 5px;
    }
</style>
<body>
    <div class="form-container">
        <div class="form-title">编辑设备点检保养项目</div>

        @Html.AntiForgeryToken()
        <form class="layui-form" lay-filter="addForm">
            <input type="hidden" id="spotCheckId" name="id" value="0">
            <div class="layui-form-item">
                <label class="layui-form-label"><span class="required">*</span>项目编码</label>
                <div class="layui-input-block">
                    <div class="flex-input-container">
                        <input type="text" id="projectCode" name="projectCode" placeholder="请输入项目编码" autocomplete="off" class="layui-input" lay-verify="required">
                        <button type="button" class="layui-btn layui-btn-sm auto-generate-btn" onclick="generateProjectCode()">
                            <i class="layui-icon">&#xe615;</i> 自动生成
                        </button>
                    </div>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">项目名称</label>
                <div class="layui-input-block">
                    <input type="text" id="projectName" name="projectName" placeholder="请输入项目名称" autocomplete="off" class="layui-input">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label"><span class="required">*</span>项目类型</label>
                <div class="layui-input-block">
                    <input type="radio" name="projectType" value="1" title="设备点检" checked>
                    <input type="radio" name="projectType" value="2" title="设备保养">
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">是否启用</label>
                <div class="layui-input-block">
                    <input type="radio" name="states" value="1" title="是" checked>
                    <input type="radio" name="states" value="0" title="否">
                </div>
            </div>

            <div class="layui-form-item layui-form-text">
                <label class="layui-form-label"><span class="required">*</span>项目内容</label>
                <div class="layui-input-block">
                    <textarea name="projectContent" id="projectContent" placeholder="请输入项目内容" class="layui-textarea" rows="4" lay-verify="required"></textarea>
                </div>
            </div>

            <div class="layui-form-item layui-form-text">
                <label class="layui-form-label">标准</label>
                <div class="layui-input-block">
                    <textarea name="standard" id="standard" placeholder="请输入标准" class="layui-textarea" rows="4"></textarea>
                </div>
            </div>

            <div class="button-group">
                <button class="layui-btn layui-btn-normal" lay-submit lay-filter="saveForm">
                    <i class="layui-icon">&#xe605;</i> 更新
                </button>
                <button type="button" class="layui-btn layui-btn-primary" onclick="cancelAdd()">
                    <i class="layui-icon">&#x1006;</i> 取消
                </button>
            </div>
        </form>
    </div>
</body>
<script src="~/scripts/jquery-3.4.1.min.js"></script>
<script src="~/scripts/layui-v2.5.6/layui/layui.js"></script>
<script>
    // 全局变量
    var spotCheckId = 0;

    layui.use(['form', 'layer'], function () {
        var form = layui.form;
        var layer = layui.layer;

        // 页面加载时获取URL参数中的id并加载数据
        var urlParams = new URLSearchParams(window.location.search);
        spotCheckId = urlParams.get('id');
        if (spotCheckId) {
            $('#spotCheckId').val(spotCheckId);
            loadSpotCheckData(spotCheckId);
        }

        // 表单提交
        form.on('submit(saveForm)', function (data) {
            var formData = data.field;

            // 数据类型转换
            formData.projectType = parseInt(formData.projectType);
            formData.states = parseInt(formData.states);

            // 获取防伪令牌
            var token = $('input[name="__RequestVerificationToken"]').val();

            $.ajax({
                url: '/SpotChecks/UpdateSpotChecks',
                type: 'POST',
                data: formData,
                headers: {
                    'RequestVerificationToken': token
                },
                success: function (result) {
                    if (result > 0) {
                        layer.msg('更新成功！', {
                            icon: 1,
                            time: 1500
                        }, function () {
                            // 关闭当前窗口并刷新父页面
                            try {
                                var index = parent.layer.getFrameIndex(window.name);
                                parent.layer.close(index);
                                // 不再调用重新加载整个列表的方法，让父页面的end回调处理更新
                            } catch (e) {
                                window.close();
                            }
                        });
                    } else {
                        layer.msg('更新失败！', { icon: 2 });
                    }
                },
                error: function (xhr, status, error) {
                    layer.msg('更新失败：' + error, { icon: 2 });
                }
            });
            return false;
        });
    });

    // 加载点检保养项目数据
    function loadSpotCheckData(id) {
        $.ajax({
            url: '/SpotChecks/FindSpotChecks',
            type: 'GET',
            data: { id: id },
            success: function (result) {
                if (result && result.length > 0) {
                    var data = result[0]; // 获取第一条数据
                    
                    // 填充表单数据
                    $('#projectCode').val(data.projectCode || '');
                    $('#projectName').val(data.projectName || '');
                    $('#projectContent').val(data.projectContent || '');
                    $('#standard').val(data.standard || '');
                    
                    // 设置项目类型单选框
                    $('input[name="projectType"][value="' + data.projectType + '"]').prop('checked', true);
                    
                    // 设置是否启用单选框
                    $('input[name="states"][value="' + data.states + '"]').prop('checked', true);
                    
                    // 重新渲染表单
                    layui.form.render();
                } else {
                    layui.layer.msg('数据加载失败', { icon: 2 });
                }
            },
            error: function (xhr, status, error) {
                layui.layer.msg('数据加载失败：' + error, { icon: 2 });
            }
        });
    }

    // 自动生成项目编码
    function generateProjectCode() {
        var timestamp = new Date().getTime();
        var randomNum = Math.floor(Math.random() * 1000);
        var projectCode = 'PC' + timestamp.toString().slice(-8) + randomNum.toString().padStart(3, '0');
        document.getElementById('projectCode').value = projectCode;
        layui.form.render();
    }

    // 取消编辑
    function cancelAdd() {
        layui.layer.confirm('确定要取消编辑吗？', {
            btn: ['确定', '继续编辑']
        }, function (index) {
            try {
                var frameIndex = parent.layer.getFrameIndex(window.name);
                parent.layer.close(frameIndex);
            } catch (e) {
                window.close();
            }
            layui.layer.close(index);
        });
    }
</script>
